import React, { memo } from "react";
import { Tabbar } from "react-vant";
import { FriendsO, HomeO, Search, SettingO } from "@react-vant/icons";
import { useLocation, useNavigate } from "react-router-dom";
const MyTarbar = memo(() => {
  let location = useLocation();
  let navigate = useNavigate();
  return (
    <div>
      <Tabbar value={location.pathname} onChange={(v) => navigate(v)}>
        <Tabbar.Item name="/home" icon={<HomeO />}>
          首页
        </Tabbar.Item>
        <Tabbar.Item name="/about" icon={<Search />}>
          分类
        </Tabbar.Item>
        <Tabbar.Item name="/my" icon={<FriendsO />}>
          购物车
        </Tabbar.Item>
        <Tabbar.Item name="/login" icon={<SettingO />}>
          登录
        </Tabbar.Item>
      </Tabbar>
    </div>
  );
});

export default MyTarbar;
